<template>
  <div class="modal-form-container">
    <vuescroll :ops="ops">
      <Form ref="info" :model="data" :rules="rules" :label-width="100">
        <FormItem :label="$t('NNqwsiYKNFh8WR5Mvlwed')" prop="chargeStationName">
          <Input v-model="data.chargeStationName" />
        </FormItem>
        <FormItem :label="$t('81K1V1IGGHxPb42EVYt1M')">
          <Input v-model="data.chargeStationAddress" />
        </FormItem>
        <FormItem :label="$t('--tuVB53obv9ckJ342vmq')">
          <Input v-model="data.buildTime" />
        </FormItem>
        <FormItem :label="$t('jE688EYtIT7-N6CXSWl5L')">
          <Input v-model="data.phone" />
        </FormItem>
        <FormItem :label="$t('Q58DQAm6oYtp3k-cvxlbn')">
          <Input v-model="data.contact" />
        </FormItem>
        <FormItem :label="$t('MV-P1vHjPXG7_m9z2N7Zk')" prop="number">
          <Input v-model="data.number" />
        </FormItem>
        <FormItem :label="$t('XFwfPUTLva8MqiN7pf2Zi')">
          <Input v-model="data.longitude" />
        </FormItem>
        <FormItem :label="$t('wQpxz0tr60n-TvmAXis8q')">
          <Input v-model="data.dimension" />
        </FormItem>
        <FormItem :label="$t('b_vZf8lLCYQPjgL7H8oNH')($t('oRE-hmg-ruA-brCejpC1w') + '4:5')">
          <div class="upload-list">
            <img :src="data.img">
          </div>
        </FormItem>
        <FormItem :label="$t('R50mHX0LambJk39x8cmq6')">
          <Input v-model="data.note" type="textarea" :autosize="{minRows: 2,maxRows: 5}" />
        </FormItem>
        <FormItem :label="$t('-I5CfrSiXKP-rpaBq-v31')">
          <Input v-model="data.serviceCost" />
        </FormItem>
        <FormItem :label="$t('zdQp578sePlTr1mSxdEpb')">
          <Input v-model="data.parkCost" />
        </FormItem>
        <FormItem>
          <Button style="margin-left: 8px" @click="close">{{$t('2LFpg56tAgKyBB40xpv5l')}}</Button>
        </FormItem>
      </Form>
    </vuescroll>
  </div>
</template>

<script>
import vuescroll from 'vuescroll'

export default {
  name: 'charge_station_form_info',
  components: {
    vuescroll
  },
  props: {
    data: Object,
    rules: Object
  },
  data () {
    return {
      ops: {
        scrollPanel: {
          maxHeight: 500
        }
      }
    }
  },
  methods: {
    close () {
      this.$emit('close')
    }
  }
}
</script>
